<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>管理员登录</title>
    <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet" crossorigin="anonymous">
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/js/bootstrap.bundle.min.js"  crossorigin="anonymous"></script>
    <style type="text/css">
        body{
            width: 100%;
            height: 100vh;
            display: flex;
            flex-direction:row;
            justify-content: center;
            align-items: center;
        }
    </style>
</head>
<body>
<form class="container" style="width: 400px" method="post" th:action="@{/LoginTest}" onsubmit="return test(this)" >
    <h1>管理员登录</h1>
    <div class="input-group mb-3">
        <span class="input-group-text">账号</span>
        <input type="text" class="form-control" id="adminName" name="adminName" aria-describedby="basic-addon3">
        <p th:text="${msg}"></p>
    </div>
    <br>
    <div class="input-group mb-3">
        <span class="input-group-text">密码</span>
        <input type="text" class="form-control" id="adminPass" name="adminPass" aria-describedby="basic-addon3">
    </div>
    <br>
    <div>
        <button class="btn btn-outline-info" style="width: 375px" type="submit">登录</button>
    </div>
</form>
<script type="text/javascript">
    function test(){
        if ($("#adminName").val() == ""){
            alert("账号不能为空！");
            return false;
        }
        if ($("#adminPass").val() == ""){
            alert("请输入密码");
            return false;
        }
    }
</script>
</body>
</html>